<template>
  <div class="list-div">
      <div class="title">公司介绍</div>
    <div class="content">
      {{data.content}}
    </div>
    <div class="c-img">
      <img :src="data.img" />
    </div>
  </div>

</template>

<script>
  import ElRow from "element-ui/packages/row/src/row";

  export default {
    components: {ElRow},
    name: 'BusinessScope',
    data () {
      return {
        data: {
          content:'',
          img:''
        },
      }
    },
    methods: {

      getData(){
        this.$axios.get('/api/about-us/info', {
          params: {
          }
        }).then(r => {
          let res = r.data
          if (res.code !== 1) {
            this.$message.error(res.msg)
            return
          }
          this.data = res.data
        })
      },
      init () {
        this.getData()
      }
    },
    mounted: function () {
    },
    created: function () {
      this.init()
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  h1, h2 {
    font-weight: normal;
  }
  .title{
    text-align: center;
    font-size: 50px;
  }
  .content{
    margin-left: 15%;
    width: 70%;
    text-indent: 2ch;
  }
  .c-img{
    width: 70%;
    margin-left: 15%;
    margin-top: 20px;
  }
  .c-img > img{
    width: 100%;
    aspect-ratio: 2/1;
  }

</style>
